/* ======================================================================
   SIC — iA Presenter Theme (v2 pass)
   Author: Scarlet Dame + GPT-5 Pro
   Notes:
   - Aligns with SIC Identity guide (colors, type, gradients)
   - Keeps iA's responsive layouts intact; only adjusts cosmetics
   - Safe to drop in alongside the default iA theme CSS
   ====================================================================== */

/* ---------------------------------------------------------
   0) Brand Tokens (CSS variables)
   --------------------------------------------------------- */

:root {
  --text-scale-intensity: 1;
    
  --font-weight-h1: 400;
  --font-weight-h2: 434;
  --font-weight-h3: 415;
  --font-weight-h4: 450;
  --font-weight-h5: 489;
  --font-weight-h6: 623;
  --font-weight-p: 415;
  --font-weight-header-and-footer: 450;

  --font-variation-settings-h1: 'ytuc' 65;
  --font-variation-settings-h2: 'ytuc' 1;
  --font-variation-settings-h3: 'ytuc' 35;
  --font-variation-settings-h4: 'ytuc' 50;
  --font-variation-settings-h5: 'ytuc' 1;
  --font-variation-settings-h6: 'ytuc' 1;
  --font-variation-settings-p: 'ytuc' 1;
  --font-variation-settings-header-footer: 'ytuc' 1;

  --line-height-h1: 1.2;
  --line-height-h2: 1.3;
  --line-height-h3: 1.4;
  --line-height-h4: 1.5;
  --line-height-h5: 1.3;
  --line-height-h6: 1.5;
  --line-height-p: 1.5;

  --letter-spacing-h1: 0%;
  --letter-spacing-h2: 8%;
  --letter-spacing-h3: 0%;
  --letter-spacing-h4: 0%;
  --letter-spacing-h5: 0%;
  --letter-spacing-h6: 10%;
  --letter-spacing-p: 0%;

  --case-h1: inherit;
  --case-h2: inherit;
  --case-h3: inherit;
  --case-h4: inherit;
  --case-h5: inherit;
  --case-h6: uppercase;
  --case-p: inherit;

  --margin-h1: 0.17em;
  --margin-h2: 0.17em;
  --margin-h3: 0.17em;
  --margin-h4: 0.17em;
  --margin-h5: 0.17em;
  --margin-h6: 0.5em;
  --margin-p: 0.17em;
}

.dark {
  --font-weight-h1: 400;
  --font-weight-h2: 400;
  --font-weight-h3: 400;
  --font-weight-h4: 415;
  --font-weight-h5: 441;
  --font-weight-h6: 489;
  --font-weight-p: 400;
  --font-weight-header-and-footer: 400;
}

.element-group {
  --p-base-size: 56;
  --h1-offset: 32;
  --h2-offset: 16;
  --h3-offset: 9;
  --h4-offset: 0;
  --h5-offset: -12;
  --h6-offset: -24;
  --h6-small-offset: -32;
  --blockquote-offset: 9;
  --heading-dynamic-offset: 0;
  --li-dynamic-offset: -2;

  --p-mobile-base-size: 20;
  --h1-mobile-offset: 35;
  --h2-mobile-offset: 12.5;
  --h3-mobile-offset: 6;
  --h4-mobile-offset: 0;
  --h5-mobile-offset: -3;
  --h6-mobile-offset: -4;
  --blockquote-mobile-offset: 3;
  --heading-mobile-dynamic-offset: 0;
  --li-mobile-dynamic-offset: -1;

  --scale-factor-h1: 1;
  --scale-factor-h2: 0.88;
  --scale-factor-h3: 1;
  --scale-factor-h4: 1;
  --scale-factor-h5: 1;
  --scale-factor-h6: 1;
  --scale-factor-blockquote: 1;
  --scale-factor-th: 0.75;
  --scale-factor-td: 0.9;

  --margin-base: 8;

  --paragraph-spacing: 0;
  --paragraph-indentation: 1em;
}

:root {
  /* --text-horizontal-align-layout-cover: center; */
  /* --text-vertical-align-layout-cover: center; */
  /* --text-horizontal-align-layout-title: center; */
  /* --text-vertical-align-layout-title: center; */
  /* --text-horizontal-align-layout-section: center; */
  /* --text-vertical-align-layout-section: center; */
  /* --text-horizontal-align-layout-default: center; */
  /* --text-vertical-align-layout-default: center; */
  /* --text-horizontal-align-layout-caption: center; */
  /* --text-vertical-align-layout-split: center; */
  /* --text-vertical-align-layout-3-column: center; */
}

:root {
  --sic-red:    #D64545; /* gradients only */
  --sic-terr:   #D06E4B; /* accents, slide backgrounds */
  --sic-gold:   #CDA349; /* highlight */
  --sic-blue:   #4A7AFF; /* technical/UI */
  --sic-mint:   #9CFFD0; /* atmosphere */

  /* accessibility ramps when text must pass on Paper */
  --sic-terr-700: #A6583C;
  --sic-red-600:  #C13F3F;
  --sic-gold-700: #876C30;

  --sic-paper:   #F5F4F2; /* off‑white paper */
  --sic-stone:   #6E6E6B; /* neutral gray */
  --sic-ink:     #1B1B1B; /* near black */

  /* Accent aliases */
  --accent-1: var(--sic-terr);
  --accent-2: var(--sic-blue);
  --accent-3: var(--sic-gold);
  --accent-4: var(--sic-mint);

  /* Typography */
  --title-font: "Avenue X", "Avenue Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
  --body-font:  "Source Serif 4", "Source Serif Pro", Georgia, "Times New Roman", serif;
  --ui-font:    "Source Sans 3", "Inter", system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, sans-serif;
  --code-font:  "Source Code Pro", ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;

  /* Type scale (Major Third) */
  --step--1: 0.833rem;
  --step-0:  1rem;
  --step-1:  1.25rem;
  --step-2:  1.563rem;
  --step-3:  1.953rem;
  --step-4:  2.441rem;
  --step-5:  3.052rem;

  /* Layout */
  --page-padding: clamp(20px, 4vw, 56px);
  --col-gap: clamp(16px, 3vw, 40px);

  /* Borders / shadows */
  --hairline: 1px solid color-mix(in srgb, var(--sic-ink), transparent 85%);
  --shadow-s: 0 4px 24px color-mix(in srgb, var(--sic-ink), transparent 92%);
  --shadow-m: 0 10px 40px color-mix(in srgb, var(--sic-ink), transparent 88%);
}

/* ---------------------------------------------------------
   1) Font-face (kept in case local fonts are bundled)
   These @font-face rules are optional; iA will also honor
   the "TitleFont"/"BodyFont" set in the theme JSON.
   --------------------------------------------------------- */

/* Avenue X — single OTF face (adjust path if needed) */
@font-face {
  font-family: "Avenue X";
  src: url("./fonts/Avenue X.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* Source Sans 3 (variable) */
@font-face {
  font-family: "Source Sans 3";
  src:
    local("Source Sans 3 Variable"),
    local("Source Sans 3"),
    url("./fonts/SourceSans3-VariableFont_wght.ttf") format("truetype-variations");
  font-weight: 200 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Source Sans 3";
  src:
    local("Source Sans 3 Variable Italic"),
    local("Source Sans 3 Italic"),
    url("./fonts/SourceSans3-Italic-VariableFont_wght.ttf") format("truetype-variations");
  font-weight: 200 900;
  font-style: italic;
  font-display: swap;
}

/* Source Serif 4 (variable) */
@font-face {
  font-family: "Source Serif 4";
  src:
    local("Source Serif 4 Variable"),
    local("Source Serif 4"),
    url("./fonts/SourceSerif4-VariableFont_opsz,wght.ttf") format("truetype-variations");
  font-weight: 200 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Source Serif 4";
  src:
    local("Source Serif 4 Variable Italic"),
    local("Source Serif 4 Italic"),
    url("./fonts/SourceSerif4-Italic-VariableFont_opsz,wght.ttf") format("truetype-variations");
  font-weight: 200 900;
  font-style: italic;
  font-display: swap;
}

/* Source Code Pro (variable) */
@font-face {
  font-family: "Source Code Pro";
  src:
    local("Source Code Pro Variable"),
    local("Source Code Pro"),
    url("./fonts/SourceCodePro-VariableFont_wght.ttf") format("truetype-variations");
  font-weight: 200 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Source Code Pro";
  src:
    local("Source Code Pro Variable Italic"),
    local("Source Code Pro Italic"),
    url("./fonts/SourceCodePro-Italic-VariableFont_wght.ttf") format("truetype-variations");
  font-weight: 200 900;
  font-style: italic;
  font-display: swap;
}

/* ---------------------------------------------------------
   2) Base
   --------------------------------------------------------- */

.element-group h4,
.element-group i,
.element-group em {
  /* font-family: 'iA Garamond Italic', Helvetica, Arial, sans-serif; */
}

section {
  /* iA mounts each slide inside a <section> */
  color: var(--sic-ink);
  font-family: var(--body-font);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

section > :not([class*="layout-"]) {

}

/* Visible headings */
section > :not([class*="layout-"]) h1,
[class*="layout-"] > div h1 {
  font-family: var(--title-font);
}

section > :not([class*="layout-"]) h2,
[class*="layout-"] > div h2 {
  font-family: var(--title-font);
}

section > :not([class*="layout-"]) h3,
[class*="layout-"] > div h3 {
  font-family: var(--ui-font);
}

/* Secondary headings / labels */
section > :not([class*="layout-"]) h4,
[class*="layout-"] > div h4 {
  font-family: var(--title-font);
}

/* Small title helpers */
section > :not([class*="layout-"]) h5,
[class*="layout-"] > div h5 {
  font-family: var(--ui-font);
}

section > :not([class*="layout-"]) h6,
[class*="layout-"] > div h6 {
  font-family: var(--code-font);
}

section > :not([class*="layout-"]) p,
[class*="layout-"] > div p {
  font-family: var(--body-font);
}

/* Lists */
section > :not([class*="layout-"]) ul,
section > :not([class*="layout-"]) ol {
  font-family: var(--body-font);
}

/* Inline and block code */
code, kbd, samp {
  font-family: var(--code-font);
  background: color-mix(in srgb, var(--sic-ink), transparent 94%);
  border-radius: .28em;
}

pre code {
  display: block;
  border-radius: .6em;
  box-shadow: var(--shadow-s);
}

/* Quotes */
blockquote {
  font-family: var(--body-font);
  border-left: 4px solid var(--accent-2);
  color: color-mix(in srgb, var(--sic-ink), transparent 10%);
}

/* Links */
a, a:visited {
  color: var(--accent-2);
  text-decoration-thickness: 2px;
  text-underline-offset: 2px;
}

a.citation, sup {
  vertical-align: super;
  top: -1em;
  font-family: var(--title-font);
  font-size: 0.4em;
}

.sic-logo {
  height: var(--step-4);;
}

h1 {
  flex-grow: 1 !important;
}

/* Tables */
table {
  border-collapse: collapse;
  font-family: var(--ui-font);
}

/* Print/PDF polish */
@media print {
  section { background: white !important; color: black !important; }
}

section .slide-contents.layout-title-and-columns.columns-items-3:not(.media-grid) .element-group {
  /* align-items: center !important; */
  /* justify-content: center !important; */
  /* text-align: center !important; */
}

section .slide-contents.layout-title-and-columns.columns-items-3 .element-group.title-part {  
  padding-bottom: 19vh;
}

@media (min-width: 481px) {
    section:not(.has-footer).has-footnotes.v-split-container .footnotes {
	position: absolute;
	bottom: 0;
	width: 50%;
    }
}
